<template>
	<view>
		<view class="grace-idcard-main" v-if="user_card_rz === 0">
			<view class="grace-idcard-desc">
				请如实提交真实身份证资料，乱传者封锁帐户
				<text class="is-block is-red-color">一经提交上传，无法修改</text>
			</view>
			<view class="grace-idcard-text">
				身份证照片 ( 正面 )
			</view>
			<view class="grace-idcard-items">
				<view class="grace-idcard-uper-btn" @tap="selectImg1">
					<view class="img"><image src="../../static/imgs/camera.png" mode="widthFix" /></view>
					<view class="text">拍摄或选择照片</view>
				</view>
				<view class="grace-idcard-preview">
					<image :src="idCard1"  @tap="previewImg1" mode="widthFix"></image>
				</view>
			</view>
			<view class="grace-idcard-text">
				身份证照片 ( 背面 )
			</view>
			<view class="grace-idcard-items">
				<view class="grace-idcard-uper-btn" @tap="selectImg2">
					<view class="img"><image src="../../static/imgs/camera.png" mode="widthFix" /></view>
					<view class="text">拍摄或选择照片</view>
				</view>
				<view class="grace-idcard-preview">
					<image :src="idCard2" @tap="previewImg2" mode="widthFix" />
				</view>
			</view>
			<view style="margin-top:38upx;">
				<button type="primary" @tap="uploadCards">上传</button>
			</view>
		</view>
		<view class="grace-idcard-main" v-if="user_card_rz > 0">
			<view class="grace-idcard-desc">
				您已提交过身份认证资料
				<text class="is-block is-red-color">一旦核实有误，封锁帐户</text>
			</view>
			<view class="grace-idcard-items" v-for="(item,index) in userinfo['card']" :key="index">
				<view class="is-block is-flex cardbox">
					<image :src="item.url"  mode=""></image>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
var _self;
export default {
	data() {
		return {
			foxtoken:'',
			foxtel:'',
			idCard1 : '../../static/imgs/idcard1.png',
			idCard2 : '../../static/imgs/idcard2.png',
			userinfo:[],
			user_card_rz:0
		};
	},
	onLoad:function(){
		_self = this;
		let info = this.service.getfox();
		if(info[0]){
			this.foxtoken = info[0]['foxtoken'];
			this.foxtel= info[0]['foxtel'];
			uni.request({
				url: this.service.FOX_URL + 'diamond/get_userinfo_card',
				method:'POST',
				data: {
					user_key: this.foxtoken
				},
				dataType:'json',
				header:{
					'content-type':'application/x-www-form-urlencoded',
				},
				success: res => {
					// var rest = JSON.stringify(res);
					// console.log(rest)
					var rest = res.data;
					if(rest.status == 'success'){
						this.userinfo = rest.msg;
						this.user_card_rz = this.userinfo['user_card_rz'];
						// console.log(this.userinfo)
					}else{
						uni.showToast({
							title:rest.msg,
							icon:'none',
							mask:true
						})
					}
				}
			})
		}else{
			uni.reLaunch({
				url:'../logon/login'
			})
		}
	},
	methods: {
		selectImg1 : function() {
			uni.chooseImage({
				count:1,
				success:function(res){
					_self.idCard1 = res.tempFilePaths[0];
				}
			})
		},
		selectImg2 : function() {
			uni.chooseImage({
				count:1,
				success:function(res){
					_self.idCard2 = res.tempFilePaths[0];
				}
			})
		},
		previewImg1 : function(){
			uni.previewImage({
				urls:[_self.idCard1]
			});
		},
		previewImg2 : function(){
			uni.previewImage({
				urls:[_self.idCard2]
			});
		},
		uploadCards : function(){
			if(this.idCard1 == '../../static/imgs/idcard1.png' || this.idCard2 == '../../static/imgs/idcard2.png'){
				uni.showToast({title:"请选择身份证照片", icon:"none"});
				return;
			}
			// 因底层限制一次上传一个
			uni.showLoading({title:"上传中"});
			// 上传正面
			var uploadTask1 = uni.uploadFile({
				url: this.service.FOX_URL+'diamond/upload_pic',
				filePath: _self.idCard1,
				fileType: 'image',
				formData: {
					'user_key': this.foxtoken,
					'user_tel': this.foxtel,
					'path' : 'card',
					'type' : 'card',
					'model' : 'del'
				},
				name: 'file',
				success: function (uploadFileRes) {
					// 上传成功后返回服务器端保存的路径
					// console.log(uploadFileRes.data);
					// 上传背面
					var uploadTask2 = uni.uploadFile({
						url: _self.service.FOX_URL+'diamond/upload_pic',
						filePath: _self.idCard2,
						fileType: 'image',
						formData: {
							'user_key': _self.foxtoken,
							'user_tel': _self.foxtel,
							'path' : 'card',
							'type' : 'card',
							'model' : 'doit'
						},
						name: 'file',
						success: function (uploadFileRes) {
							// 上传成功后返回服务器端保存的路径
							// console.log(uploadFileRes.data);
							// 至此2张照片上传完毕
							var pages = getCurrentPages();
							var currPage = pages[pages.length - 1]; //当前页面
							var prevPage = pages[pages.length - 2]; //上一个页面
							//直接调用上一个页面的setData()方法，把数据存到上一个页面中去
							prevPage.setData({
								isDoRefresh:true
							})
							uni.hideLoading();
							uni.showToast({
								title:'身份认证提交成功',
								icon:'none',
								mask:true
							})
							setTimeout(function() {
							    uni.navigateBack();
							}, 1500)
						}
					 });
				}
			 });
		}
	},
}
</script>
<style>
view{font-size:28upx;}
.grace-idcard-main{margin:20upx 30upx;}
.grace-idcard-desc{line-height:2em; background:#FFFFFF; padding:20upx; border-radius:10upx;}
.grace-idcard-text{line-height:2em; margin-top:30upx;}
.grace-idcard-items{background:#FFFFFF; padding:30upx 0; display:flex; margin:30upx 0; border-radius:10upx; align-items: flex-start;}
.grace-idcard-uper-btn{width:276upx; margin:0 60upx; background:#F1F1F1; padding-bottom:10upx; border-radius:10upx; text-align:center;}
.grace-idcard-uper-btn .img{width:100upx; height:100upx; margin:0 auto; margin-top:30upx;}
.grace-idcard-uper-btn .img image{width:100upx; height:100upx;}
.grace-idcard-uper-btn .text{width:100%; margin-top:10upx; text-align:center; line-height:2em;}
.grace-idcard-preview{width:50%; margin:0 30upx;}
.grace-idcard-preview image{width:100%;}
.cardbox{width:100%;padding:0 30upx;}
.cardbox image{width:100%;}
</style>